require('normalize.css');
require('styles/App.css');

import React from 'react';
import { connect } from 'react-redux'
import HeaderComponent from './common/HeaderComponent'
import NewsComponent from './news/NewsComponent'
import NewsDetailComponent from './news/NewsDetailComponent'
import TweetsComponent from './tweet/TweetsComponent'

import * as NewsAction from '../actions/NewsAction'
import * as TweetAction from '../actions/TweetAction'
import * as CommonAction from '../actions/CommonAction'

import * as Constant from '../constants/Constant'

let yeomanImage = require('../images/yeoman.png');

// let react = require('react/addons');
// let config = require('config');

class AppComponent extends React.Component {
  constructor(props) {
    super(props)
    this.handleOnHeaderTabClick = this.handleOnHeaderTabClick.bind(this)
    this.handleShowNewsDetail=this.handleShowNewsDetail.bind(this)
    // let currentAppEnv = config.appEnv;
    // alert(currentAppEnv);
    // this.handleRefreshClick = this.handleRefreshClick.bind(this)
  }

  componentDidMount(){
    const {dispatch}=this.props;
    dispatch(NewsAction.fetchNewsList());
  }

  handleOnHeaderTabClick(type){
    console.log('type='+type)
    this.props.dispatch(CommonAction.changePage(type));
    switch(type){
      case Constant.PAGES.NEWS_LIST_PAGE:
        this.props.dispatch(NewsAction.fetchNewsList());
        break;
      case Constant.PAGES.TWEET_LIST_PAGE:
        this.props.dispatch(TweetAction.fetchTweetList());
        break;

    }
  }

  handleShowNewsDetail(newsid){
    this.props.dispatch(CommonAction.changePage(Constant.PAGES.NEWS_DETAIL_PAGE));
    this.props.dispatch(NewsAction.fetchNewsDetail(newsid));
  }

  getChild(page){
    var Child;
    console.log(page)
    switch(page){
      case Constant.PAGES.NEWS_LIST_PAGE:Child=NewsComponent;break;
      case Constant.PAGES.NEWS_DETAIL_PAGE:Child=NewsDetailComponent;break;
      case Constant.PAGES.TWEET_LIST_PAGE:Child=TweetsComponent;break
      default: Child=NewsComponent;
    }
    return Child;
  }

  render() {
  	const {page} = this.props;
    var Child=this.getChild(page);
    
    return (
      <div className="body-container">
        {/*<img src={yeomanImage} alt="Yeoman Generator" />*/}
        <HeaderComponent headerTabClick={this.handleOnHeaderTabClick}/>
        <Child {...this.props} handleShowNewsDetail={this.handleShowNewsDetail}/>
      </div>
    );
  }
}

AppComponent.defaultProps = {
};

function select(state){
	return {
		news:state.news.news,
    newsDetail:state.news.newsDetail,
    page:state.commonReducer.page,
    tweets:state.tweet.tweets
	};
}
//export default AppComponent;
export default connect(select)(AppComponent);
